<script setup>
import { ref, onMounted, onUnmounted } from 'vue'
import { RouterLink, RouterView } from 'vue-router'

// 自适应rem B
const flag = ref(false)

// 防止频繁触发
const onWindowResize = () => {
  if (!flag.value) {
    flag.value = true
    setTimeout(() => {
      initFontSize()
      flag.value = false
    }, 300)
  }
}

const initFontSize = () => {
  const view_width = document.getElementsByTagName('html')[0].getBoundingClientRect().width;
  const _html = document.getElementsByTagName('html')[0];
  _html.style.fontSize = 100 * (view_width / 1920) + 'px'
}

onMounted(() => {
  initFontSize()
  window.addEventListener('resize', onWindowResize)
})

onUnmounted(() => {
  window.removeEventListener('resize', onWindowResize)
})

// 自适应rem E
</script>

<template>
  <RouterView />
</template>

<style scoped></style>
